<!--
  Generated template for the Settings page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-toolbar color="secondary">
    <ion-title>Settings</ion-title>
    <ion-buttons end>
      <button ion-button icon-only (click)="close()">
        <ion-icon name="close"></ion-icon>
      </button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content padding>
  <ion-card>
    <ion-card-header>
      About
    </ion-card-header>
    <ion-card-content>
      <p><strong>Giflist</strong>is a client for <strong>reddit</strong> that will endlessly
      <strong> stream GIFs </strong> from <strong>any subreddit that predominantly contains gifs </strong>.
      By default it uses the popular <strong>gifs</strong> subreddit, but you can change this to whatever you like,
      e.g: perfectloops, me_irl, chemicalreactionggifs.</p>
      <br/>
      <p>To play a GIF, just tap it. To view the original submissionfor any GIF, just tap the title section and it
        will open in reddit.You can configure some settings for the application below.
        Enjoy!
      </p>
    </ion-card-content>
  </ion-card>
  <h3>Subreddit</h3>
  <ion-input type="text" placeholder="enter subreddit name..." [(ngModel)]="subreddit"></ion-input>
  <h3>Sort</h3>
  <ion-segment color="secondary" [(ngModel)]="sort">
    <ion-segment-button value="hot">
      Hot
    </ion-segment-button>
    <ion-segment-button value="top">
      Top
    </ion-segment-button>
    <ion-segment-button value="new">
      New
    </ion-segment-button>
  </ion-segment>
  <h3>Per Page</h3>
  <ion-segment color="secondary" [(ngModel)]="perPage">
    <ion-segment-button value="5">
      5
    </ion-segment-button>
    <ion-segment-button value="10">
      10
    </ion-segment-button>
    <ion-segment-button value="15">
      15
    </ion-segment-button>
  </ion-segment>
  <button ion-button full (click)="save()" color="secondary" style="margin: 20px 0px;">
      Save Settings
  </button>
</ion-content>
